<template>
    <!--div>学者关注页</div-->
    <div>
        <el-container>
            <div v-if="stars.length !== 0">
                <el-table :data="stars" border>
                    <el-table-column prop="name" label="学者姓名" />
                    <el-table-column prop="orgs[0]" label="学者所属组织" />
                    <el-table-column prop="pubs.length" label="文献数量" />
                    <el-table-column prop="n_citation" label="总被引数" />
                    <el-table-column label="操作">
                        <template #default="scope">
                            <el-button type="primary" link>点击跳转至主页</el-button>
                            <el-button type="warning" link @click="dele(scope.row)">取消关注</el-button>
                        </template>
                    </el-table-column>
                </el-table>
            </div>
            <div v-else>
                您现在没有关注的学者，请
            </div>
        </el-container>
    </div>
    <el-dialog v-model="dialogVisible" title="" width="30%" :before-close="handleClose">
        <span>您将取消关注{{ cur_star.name }}，是否继续？</span>
        <template #footer>
            <span class="dialog-footer">
                <el-button @click="cancelOp">取消操作</el-button>
                <el-button type="primary" @click="continOp">
                    确定取消关注
                </el-button>
            </span>
        </template>
    </el-dialog>
</template>

<script>
import { req_starInfoGet, req_starDel } from '@/api/index.js'
import { response2ElMessage } from '@/utils/response-utils'
import {
    Iphone,
    Location,
    OfficeBuilding,
    Tickets,
    User,
} from '@element-plus/icons-vue'
import { ElMessage } from 'element-plus'
export default {
    name: 'StarScholarView',
    props: {

    },
    data() {
        return {
            stars: [],
            cur_star: '',
            dialogVisible: false,
        }
    },
    methods: {
        async StarGetRequest() {
            let response = await req_starInfoGet(this.$store.user)
            let data = response.data
            if (data['errno'] !== 1) {
                response2ElMessage(response, {
                    1003: {
                        "showElMsg": true,
                        "msg": "获取信息失败！",
                        "msgType": "warning",
                        "outputToConsole": false
                    }
                })
                this.$router.push({
                    path: '/'
                })
            }
            else {
                this.stars = data['stars']
            }
        },
        dele(scope) {
            this.cur_star = scope;
            this.dialogVisibleChange()
        },
        cancelOp() {
            ElMessage.success("取消操作成功")
            this.dialogVisibleChange()
        },
        async continOp() {
            let response = await req_starDel(this.cur_star)
            let data = response.data
            this.dialogVisibleChange()
            if (data['errno'] === 1) {
                ElMessage.success("取消关注成功")
                this.StarGetRequest()
            }
            else {
                ElMessage.error("取消关注失败！")
            }
        },
        dialogVisibleChange() {
            this.dialogVisible = !this.dialogVisible
        }
    },
    created() {
        this.stars = [{
            "id": "<科研学者id>",
            "name": "<str, 姓名11>",
            "orgs": ["<str, 组织名称>", "<str, 组织名称>"],
            "pubs": [
                { "i": "<文献id>", "r": "<int, 第几作者>" },
                { "i": "<文献id>", "r": "<int, 第几作者>" },
            ],
            "n_citation": "<int, 总被引数>"
        },
        {
            "id": "<科研学者id>",
            "name": "<str, 姓名>",
            "orgs": ["<str, 组织名称>", "<str, 组织名称>"],
            "pubs": [
                { "i": "<文献id>", "r": "<int, 第几作者>" },
                { "i": "<文献id>", "r": "<int, 第几作者>" },
            ],
            "n_citation": "<int, 总被引数>"
        },
        {
            "id": "<科研学者id>",
            "name": "<str, 姓名>",
            "orgs": ["<str, 组织名称>", "<str, 组织名称>"],
            "pubs": [
                { "i": "<文献id>", "r": "<int, 第几作者>" },
                { "i": "<文献id>", "r": "<int, 第几作者>" },
            ],
            "n_citation": "<int, 总被引数>"
        }]
        //StarGetRequest();
    },
    mounted() {

    }
}
</script>
